//
//  HomeDialogView.swift
//  Chatup
//
//  Created by op on 2023/10/19.
//

import SwiftUI

struct HomeItemView:View {
    @State var model:HomeDialogModel
    @State var curRoleId:Int
    @State var index:Int
    var body: some View {
        HStack(alignment: .center){
            
//            if index % 3 == 1 {
//                Divider()
//                    .frame(height: 69)
//            }
//            Spacer().frame(width: 30)
            VStack {
                if model.id == curRoleId{
                    Image(model.image)
                        .resizable()
                        .frame(width: 54,height: 54,alignment: .bottom)
                        .overlay(
                            RoundedRectangle(cornerRadius: 27)
                            .inset(by: 1)
                            .stroke(Color(red: 0.15, green: 0.75, blue: 0.46), lineWidth: 2)
                        )
                }else{
                    Image(model.image)
                        .resizable()
                        .frame(width: 54,height: 54,alignment: .bottom)
                }
               


                Spacer()
                    .frame(height: 14)
                Text(model.name)
                    .font(.system(size: 14))
                    .foregroundColor(.white)
                    .lineLimit(1)
                Text(model.desc)
                    .font(.system(size: 10))
                    .foregroundColor(.white.opacity(0.4))
                    .frame(alignment: .top)
                    .lineLimit(1)
                
            
            }
//            Spacer()
//            if index % 3 == 1 {
//                Divider()
//                    .frame(height: 69)
//            }
        }
    }
}

struct HomeDialogView: View {
    @StateObject var viewModel = HomeDialogViewModel()
    @Binding var showDialog:Bool
    @Binding var chooseDialogIndex:Int
    @State var curRoleId:Int
    let columns: [GridItem] = [
        GridItem(.flexible(minimum: 0, maximum: .infinity)),
            GridItem(.flexible(minimum: 0, maximum: .infinity)),
            GridItem(.flexible(minimum: 0, maximum: .infinity))
        ]
    var body: some View {
        
        GeometryReader(content: { geometry in
            ZStack {
                Color.black.opacity(0.5)
                    .onTapGesture {
                        showDialog.toggle()
                    }
                VStack(spacing:0){
                    Spacer()
                        .frame(height: 90)
                    HStack {
                        Spacer()
                        Image("icon_arraw")
                            .resizable()
                            .frame(width: 24,height: 12)
                        Spacer()
                            .frame(width: 30)
                    }
                    .padding(.horizontal,30)
                    ScrollView{
                        LazyVGrid(columns: columns, spacing: 0){
                            ForEach(viewModel.items.indices, id: \.self) { index in
                                Button(action: {
                                    showDialog = false
                                    chooseDialogIndex = viewModel.items[index].id
                                }, label: {
                                    HomeItemView(model: viewModel.items[index],curRoleId: curRoleId, index: index)
                                        .padding().padding(.bottom,0)
                                })
                                
                            }

                        }
                    }
                    .frame(width: geometry.size.width - 40,height: geometry.size.height * 0.75)
                    .background(Color(red: 0.13, green: 0.14, blue: 0.2))
                    .cornerRadius(16)
                    Spacer()
                }

            }
        })
    }
}

#Preview {
    HomeDialogView(showDialog: .constant(false), chooseDialogIndex: .constant(0), curRoleId: 0)
}
